<template>
    <div id="reamark">
        <el-input
            type="textarea"
            :autosize="false"
            placeholder="请输入备注"
            maxlength="1500"
            show-word-limit
            v-model="content"
            @change="handleTextarea"
        >
        </el-input>
    </div>
</template>
<script lang="ts">
import { Component, Vue, Prop, Watch, Emit } from 'vue-property-decorator';

@Component({ name: 'Reamark', components: {} })
export default class Reamark extends Vue {
    @Prop({ default: false }) showData: boolean;
    @Prop() entryControl!: any;

    content: string = '';

    @Watch('entryControl', { immediate: true, deep: true })
    watchentryControl(newData) {
        if (newData.content) {
            this.content = newData.content;
        }
    }

    /**
     * 文本域变更事件
     */
    @Emit('content-change')
    handleTextarea($event) {
        return $event;
    }
}
</script>
<style lang="scss" scoped>
#reamark {
    height: 100%;

    .el-textarea {
        height: 100%;

        /deep/ .el-textarea__inner {
            height: 100% !important;
        }
    }
}
</style>
